import { ModalForm, ProForm, ProFormInstance, ProFormText } from '@ant-design/pro-components';
import { Form,message,Select } from 'antd';
import { useEffect, useRef } from 'react';
import { waitTime } from '@/utils/request';
import { addContacts, updateContacts } from '@/services/api/contacts';

interface InputDialogProps {
  detailData?: API.ContactsDTO;
  visible: boolean;
  onClose: (result: boolean) => void;
}

export default function InputDialog(props: InputDialogProps) {
  const form = useRef<ProFormInstance>(null);

  useEffect(() => {
    waitTime().then(() => {
      if (props.detailData) {
        form?.current?.setFieldsValue(props.detailData);
      } else {
        form?.current?.resetFields();
      }
    });
  }, [props.detailData, props.visible]);

  const onFinish = async (values: any) => {
    const {contactsName,gender,email,contactPhone,province, departmentName} = values;
    const data: API.ContactsDTO = {
      id: props.detailData?.id,
      contactsName,
      gender,
      province,
      contactPhone,
      email,
      departmentName,
    };

    try {
      if (props.detailData) {
        await updateContacts(data, { throwError: true });
      } else {
        await addContacts(data, { throwError: true });
      }
    } catch (ex) {
      return true;
    }

    props.onClose(true);
    message.success('保存成功');
    return true;
  };

  return (
    <ModalForm
      width={600}
      onFinish={onFinish}
      formRef={form}
      modalProps={{
        destroyOnClose: true,
        onCancel: () => props.onClose(false),
      }}
      title={props.detailData ? '修改联系人' : '新建联系人'}
      open={props.visible}
    >
      <ProFormText
        name="contactsName"
        label="姓名"
        rules={[
          {
            required: true,
            message: '请输入姓名！',
          },
        ]}
      />
       <ProFormText
          name="contactPhone"
          label="联系号码"
          rules={[
            {
              required: true,
              message: '请输入联系号码！',
            },
          ]}
        />
        <ProFormText
          name="gender"
          label="性别"
          rules={[
            {
              required: false,
              message: '请输入性别！',
            },
          ]}
        />
        <ProFormText
          name="departmentName"
          label="部门"
          rules={[
            {
              required: false,
              message: '请输入联系人所在部门！',
            },
          ]}
        />
         <Form.Item label="省份" name="province" rules={[
          {
            required: true,
            message: '请选择联系人省份！',
          },
        ]}>
        <Select size='large'>
          <Select.Option value="北京市">北京市</Select.Option>
          <Select.Option value="天津市">天津市</Select.Option>
          <Select.Option value="上海市">上海市</Select.Option>
          <Select.Option value="重庆市">重庆市</Select.Option>
          <Select.Option value="河北省">河北省</Select.Option>
          <Select.Option value="山西省">山西省</Select.Option>
          <Select.Option value="辽宁省">辽宁省</Select.Option>
          <Select.Option value="吉林省">吉林省</Select.Option>
          <Select.Option value="黑龙江省">黑龙江省</Select.Option>
          <Select.Option value="江苏省">江苏省</Select.Option>
          <Select.Option value="浙江省">浙江省</Select.Option>
          <Select.Option value="安徽省">安徽省</Select.Option>
          <Select.Option value="福建省">福建省</Select.Option>
          <Select.Option value="江西省">江西省</Select.Option>
          <Select.Option value="山东省">山东省</Select.Option>
          <Select.Option value="河南省">河南省</Select.Option>
          <Select.Option value="湖北省">湖北省</Select.Option>
          <Select.Option value="湖南省">湖南省</Select.Option>
          <Select.Option value="广东省">广东省</Select.Option>
          <Select.Option value="海南省">海南省</Select.Option>
          <Select.Option value="贵州省">贵州省</Select.Option>
          <Select.Option value="云南省">云南省</Select.Option>
          <Select.Option value="陕西省">陕西省</Select.Option>
          <Select.Option value="甘肃省">甘肃省</Select.Option>
          <Select.Option value="青海省">青海省</Select.Option>
          <Select.Option value="台湾省">台湾省</Select.Option>
          <Select.Option value="内蒙古自治区">内蒙古自治区</Select.Option>
          <Select.Option value="广西壮族自治区">广西壮族自治区</Select.Option>
          <Select.Option value="西藏自治区">西藏自治区</Select.Option>
          <Select.Option value="宁夏自治区">宁夏回族自治区</Select.Option>
          <Select.Option value="新疆维吾尔自治区">新疆维吾尔自治区</Select.Option>
          <Select.Option value="香港特别行政区">香港特别行政区</Select.Option>
          <Select.Option value="澳门特别行政区">澳门特别行政区</Select.Option>
        </Select>
      </Form.Item>
      <ProForm.Group>
                <ProFormText
          name="email"
          label="邮件"
          rules={[
            {
              required: false,
              message: '请输入邮件！',
            },
          ]}
        />
      </ProForm.Group>
    </ModalForm>
  );
}
